var E = window.wangEditor
var editor = new E('#div1', '#div3')
let whiteList = ['https://dskj001.oss-cn-shenzhen.aliyuncs.com']
var activeImg

// editor.customConfig.menus = [
//     'head',  // 标题
//     'bold',  // 粗体
//     'fontSize',  // 字号
//     'fontName',  // 字体
//     'italic',  // 斜体
//     'underline',  // 下划线
//     'strikeThrough',  // 删除线
//     'foreColor',  // 文字颜色
//     'backColor',  // 背景颜色
//     'link',  // 插入链接
//     'list',  // 列表
//     'justify',  // 对齐方式
//     'quote',  // 引用
//     'emoticon',  // 表情
//     'image',  // 插入图片
//     'table',  // 表格
//     'video',  // 插入视频
//     'code',  // 插入代码
//     'undo',  // 撤销
//     'redo'
// ]

editor.customConfig.onblur = function (html) {
  console.log('onblur');
  // clickImg()
}

// 粘贴回调
editor.customConfig.pasteTextHandle = function (content) {
  return matchImg(content)
}

editor.customConfig.onchangeTimeout = 1000

editor.customConfig.onchange = async function (content) {

  // 创建一个虚拟容器
  let divEl = document.createElement('div')
  divEl.innerHTML = content

  // 找出所有图片
  let imgAll = divEl.querySelectorAll("img"),
      changeImg = false

  for (let item of imgAll) {
    let url = item.getAttribute('dictionaries_url')

    // 判断域名是否白名单
    let whiteListIndex = whiteList.findIndex((val) => {
      console.log(item.src, val);
      return item.src.indexOf(val) !== -1
    })

    // 白名单不通过 或者 没有上传的图片
    if (Number(whiteListIndex) !== -1 || !url) continue


    // console.log(url);

    let base64 = await getBase64(url, 'png')

    let blob = await dataURLtoBlob(base64);
    console.log(blob);
    res = await updateImg(blob)

    item.src = res
    console.log(item.src);
    editor.txt.html(divEl.innerHTML)
  }
  editor.txt.html(divEl.innerHTML)
  clickImg()
}

function clickImg() {
  let arr = document.querySelector('#div3 .w-e-text').querySelectorAll(".pgc-image .editor-image-menu-item")
  for (let item of arr) {
    item.onclick = function (e) {
      console.log(e);
      for (let item of  e.path) {
        if (item.className === "pgc-img-wrapper") {
          activeImg = item.children[0]
          cropper.replace(activeImg.src)
          document.querySelector('.pop-up-model').style.display = "flex"
          openActionBtn(activeImg)
          activeImg = item.children[0]
        }
      }
      clickImg()
    }
  }
}

function openActionBtn(activeImgParams) {
  console.log(activeImgParams);
  document.getElementById('action-img-btn').onclick = async function (e) {
    let innerHTML = e.target.innerHTML

    switch (innerHTML) {
      case '取消' :
        document.querySelector('.pop-up-model').style.display = "none"
        break
      case '保存' :
        let blob = await returnCropperBlob()

        e.target.innerHTML = '上传中'
        let res = await updateImg(blob)
        activeImgParams.src = res

        e.target.innerHTML = '保存'
        document.querySelector('.pop-up-model').style.display = "none"


        // let editorHtml = document.getElementById('div3').querySelector('.w-e-text')
        //
        // editor.txt.html(editorHtml.innerHTML)
        clickImg()

        console.log(activeImgParams);

        break
    }
  }
}


editor.create()


